(function () {
  async function render(){
    let res=await getDataSort()
    // console.log(res);
    let {data:{data}}=res
    // console.log(data);
    let str=''
    data.forEach(({id,cate_name,cate_alias})=>{
    str+=`
    <tr>
        <td>${cate_name}</td>
        <td>${cate_alias}</td>
        <td>
          <button class="compile" data-id="${id}">编辑</button>
          <button class="dele" data-id="${id}">删除</button>
        </td>
      </tr>
    `    
    document.querySelector('tbody').innerHTML=str
})
  }
  render()
  let reg=/(\w){1,15}/;
  // 模态框
  let mask=document.querySelector('.mask')
  // 模态框取消按钮
  let maskn=document.querySelector('.mask-none')
  // 添加类型按钮
  let tianjia=document.querySelector('.tianjia')
  // 确定添加
  let btn=document.querySelector('.mask-btn')
  //重置按钮
  let bts=document.querySelector('.mask-bts')
  // 标题1框
  let nametp=document.querySelector('.nametp')
  // 标题2框
  let name2tp=document.querySelector('.name2tp')
  // 编辑按钮
  let compile=document.querySelector('.compile')
  let tbody=document.querySelector('tbody')
  console.log(compile);
  // 删除按钮
  let dele=document.querySelector('.dele')
  let status=''


   maskn.addEventListener('click',function(){
  mask.style.display='none'
   })
  
  //  发送添加文章类别请求
  async function postAricate(obj){
    let res= await addDataSort(obj)
    console.log(res);
     await render()
  }
  // 发送编辑文章类别请求
  async function postAricate1(obj){
    let res= await infoDataSort(obj)
    console.log(res);
    await render()
  }

  async function getBYID(artid){
    let res=await getArticleId(artid)
    console.log(res);
    let {data:{data:{id,cate_name,cate_alias}}}=res
    nametp.value=cate_name
    name2tp.value=cate_alias
    await render()
   }

  // 点击添加类别
  tianjia.addEventListener('click',addArtcatee)
  function addArtcatee(){
   status='确定添加'
   mask.style.display='block'
   nametp.value=''
   name2tp.value=''
  }
  // 点击编辑
  let artid=
  tbody.addEventListener('click',function(e){
   if(e.target.textContent==='编辑'){
    status = '编辑'
    mask.style.display='block'
    let {id}=e.target.dataset
    getBYID(id)
    artid=id
   }
  })
  
// 点击确认添加或编辑
 btn.addEventListener('click',function(e){
  if(status==='确定添加'){
    console.log(status);
    let obj={
      "cate_name":nametp.value.trim(),
      "cate_alias":name2tp.value.trim(),
    }
    postAricate(obj)
    }
    if(status==='编辑'){
      let obj={
      "id":artid,
      "cate_name":nametp.value.trim(),
      "cate_alias":name2tp.value.trim(),
      }
      postAricate1(obj)
    }
    mask.style.display='none'
 })
  bts.addEventListener('click',restInput)
  function  restInput(){
    nametp.value=''
    name2tp.value=''
  }

  name2tp.addEventListener('blur',function(){
   let s= reg.test(name2tp.value)
   if(s===false){
    alert('数据不合法')
   }
  })


 ;


  // 发送删除请求
 
  // async function deleStr(id)
  //   let res= await delDataSort(id)
  //  let mad = await getDataSort(
   
  // 
  tbody.addEventListener('click',async function(e){
    if(e.target.textContent==='删除'){
      await delDataSort(e.target.dataset.id);
     window.location.reload();
     render()
    }
   
  })
 
})()